<template>
  <GlobalHeader />

  <v-container>
    <h2 class="text-h5 mb-4">历史评估记录</h2>

    <v-data-table
        :headers="headers"
        :items="historyRecords"
        class="elevation-1"
    >
      <template #item.totalScore="{ item }">
        {{ truncateToFourDecimals(item.totalScore) }}
      </template>
      <template #item.finalValuation="{ item }">
        {{ truncateToFourDecimals(item.finalValuation) }}
      </template>
      <template #no-data>
        <v-alert type="info" class="ma-2">
          暂无历史记录
        </v-alert>
      </template>
    </v-data-table>
  </v-container>

  <AppFooter />
</template>

<script setup>
import { ref, onMounted } from 'vue'
import axios from 'axios'

// 组件
import GlobalHeader from '@/components/Index/GlobalHeader.vue'
import AppFooter from '@/components/Footer/AppFooter.vue'

// 表头
const headers = ref([
  { title: '得分', key: 'totalScore', align: 'center' },
  { title: '等级', key: 'grade', align: 'center' },
  { title: '估值', key: 'finalValuation', align: 'center' },
  { title: '最终价格', key: 'finalRealPrice', align: 'center' },
  { title: '时间', key: 'evaluationTime', align: 'center' }
])

// 数据数组
const historyRecords = ref([])

const fetchHistoryRecords = async () => {
  try {
    const response = await axios.get('/api/evaluation/history')
    historyRecords.value = response.data.reverse()
  } catch (err) {
    console.error('获取历史记录失败：', err)
  }
}

onMounted(() => {
  fetchHistoryRecords()
})
//截断分数
function truncateToFourDecimals(num) {
  return Number(num).toFixed(5).slice(0, -1); // 去掉最后一位实现截断
}
</script>

<style scoped>
</style>
